.page-wrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: #f4f4f4;

  .page-header {
    padding: 30upx;
    flex: 0;
    background: #007BDE;

    .header-user {
      padding: 30upx;
      background: white;
      display: flex;
      border-radius: 16upx;

      .user-image {
        flex: 0;
        flex-basis: 80upx;
        width: 80upx;
        height: 80upx;
      }

      .user-info {
        margin-left: 20upx;
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;

        .user-name {
          font-weight: 500;
          font-size: 32upx;
          color: #333333;
          line-height: 44upx;
        }

        .user-role {
          display: flex;

          .user-role-logout {
            border-radius: 6upx;
            padding: 6upx 10upx;
            background: #165DFF;
            font-weight: 500;
            font-size: 20upx;
            color: #ffffff;
            line-height: 28upx;
          }
        }
      }

      .user-setting {
        margin: 20upx 0;
        flex: 0;
        flex-basis: 40upx;
        width: 40upx;
        height: 40upx;
      }
    }
  }

  .page-body {
    flex: 1;
    padding: 30upx;
    display: flex;
    flex-direction: column;

    .body-logout {
      flex: 1;

      .menu-list {
        display: flex;
        flex-wrap: wrap;

        .menu-item {
          margin: 15upx;
          padding: 30upx;
          border-radius: 16upx;
          background: white;
          flex: 1;
          text-align: center;

          .menu-item-image {
            width: 150upx;
            height: 150upx;
          }

          .menu-item-content {
            margin-top: 10upx;
            font-size: 36upx;
            line-height: 48upx;
            color: #333333;
            font-weight: 400;
          }
        }
      }
    }

    .body-version {
      flex: 0;
      font-size: 24upx;
      line-height: 30upx;
      color: #999999;
      font-weight: 400;
      text-align: center;
    }
  }
}